<template>
	<div class="mainCont">
		<div class="leftCont">
			<ul class="snav">
				<li v-for="(i, index) in 14" @click="choose(index)">
					<div to="/repositorySearch" v-if="$route.name == 'internet'" class="navlist"
						:class="nowactive == index ? 'active' : ''"><span class="iconfont icon-jiaohuanji"></span> 住院二部汇聚交换机
						<span class="iconfont icon-bianji" v-if="nowactive == index"> </span><span
							class="iconfont icon-shanchu" v-if="nowactive == index"></span>
					</div>
				</li>
			</ul>
			<div class="add">
				<div class="addas">
					<div class="font">
						<div class="ssspan">+</div>
						<div>
							添加交换机

						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="rightCont">
			<router-view>
			</router-view>
		</div>

	</div>
</template>
<script type="text/babel">
export default {
	name: "",
	data() {
		return {
			down1: true,
			down2: true,
			down3: true,
			permissions: [],
			nowactive: 0
		};
	},
	components: {},

	created() { },

	mounted() {
		// // alert(456)
		var that = this
		// console.log(that.$permissions)
		// if(!this.$route.params.title){
		// 	var n = 10
		// var url = ''

		// setTimeout(function(){
		that.permissions = that.$permissions
		// 	if(that.permissions.indexOf(56) != -1){
		// 		that.$router.push('/repositorySearch');
		// 	}else if(that.permissions.indexOf(58) != -1){
		// 		that.$router.push('/myRepository');
		// 	}else if(that.permissions.indexOf(60) != -1){
		// 		that.$router.push('/repositoryAudit');
		// 	}

		// },100)
		// }else{
		// 	that.permissions = that.$permissions
		// }

	},

	methods: {
		flushCom: function () {
			// 　　　　　　this.$router.go(0);  

		}
		, choose(i) {
			this.nowactive = i
		}
	},

	computed: {},
};
</script>
<style lang='less' scoped>
.add {
	padding: 20px;

	.addas {
		width: 100%;
		border: 2px solid #73a3f2;
		height: 50px;
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;

		.font {
			color: #3f78d3;
			display: flex;
			justify-content: center;
			align-items: center;
			height: 50px;

			.ssspan {
				font-size: 33px;
				height: 30px;
				padding-bottom:4px;
				// line-height: 50px;
				display: flex;
				justify-content: center;
				align-items: center;
				// font-weight:bold;
			}
		}
	}
}

li {
	background: #fff;
	position: relative;
	z-index: 2;

}

.navlist {
	color: black;
	font-size: 13px;
	// text-align: center;
	padding: 5px 0;
	padding: 5px 20px;

	cursor: pointer;
}

.navlist :hover {
	color: #71a2f8;
	background-color: #ecf4ff;
}

.mainCont {
	padding-left: 220px;
}

.leftCont {
	width: 220px;
	padding: 15px 0px;
}

.rightCont {
	position: relative;
}

.active {
	color: #409eff;
	background-color: #ecf4ff;
}

.icon-up {
	transition: all .3s;
}

.down {
	transition: all .3s;
}
</style>
